<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right" class="marginTop">
      <el-breadcrumb-item >公司厅店状态改变申请管理</el-breadcrumb-item>
    </el-breadcrumb>

    <!-- table表格区域 -->
    <el-table :data="list" border stripe style="width: 100%" class="marginTop">
      <!-- 展开行 -->
      <el-table-column type="expand">
        <template slot-scope="props">
          <!-- {{scope.row}} -->
          <el-form label-position="left" inline class="demo-table-expand">
            <el-form-item label="部门审核结果">
              <span>{{ props.row.departmentOutcome }}</span>
            </el-form-item>
            <el-form-item label="流程名">
              <span>{{ props.row.processName }}</span>
            </el-form-item>
            <el-form-item label="流程id">
              <span>{{ props.row.processId }}</span>
            </el-form-item>
            <el-form-item label="厅店目标状态">
              <span>{{ props.row.targetState|openOrClose }}</span>
            </el-form-item>
            <el-form-item label="起始时间">
              <span>{{ props.row.startTime }}</span>
            </el-form-item>
            <el-form-item label="任务">
              <span>{{ props.row.taskName }}</span>
            </el-form-item>
            <el-form-item label="任务id">
              <span>{{ props.row.taskId }}</span>
            </el-form-item>
            <el-form-item label="发起人">
              <span>{{ props.row.INITIATOR }}</span>
            </el-form-item>
            <el-form-item label="厅店id">
              <span>{{ props.row.sid }}</span>
            </el-form-item>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column type="index" label="#"></el-table-column>
      <el-table-column label="流程名" prop="processName"></el-table-column>
      <el-table-column label="任务名" prop="taskName" width="200px"></el-table-column>
      <el-table-column label="起始时间" prop="startTime" width="200px"></el-table-column>
      <el-table-column label="发起人" prop="INITIATOR" width="200px"></el-table-column>
      <el-table-column label="厅店id" prop="sid" width="200px"></el-table-column>
      <el-table-column label="部门审核结果" prop="departmentOutcome" width="200px"></el-table-column>
      <el-table-column fixed="right" label="操作" width="230px">
        <template slot-scope="scope">
          <el-button  type="primary"  @click="agree(scope.row)">同意</el-button>
          <el-button  type="danger" @click="reject(scope.row)">驳回</el-button>
        </template>
      </el-table-column>
    </el-table>
    </el-card>

  </div>
</template>

<script>
  export default {
    name: "user",
    data() {
      return {
        list:[]
      };
    },
    mounted() {
      this.getInfoList();
    },
    methods: {
      //获取数据
      async getInfoList() {
        let { data: res } = await this.$http.get("/admin/corporation/trackall")
        let changeList=[]
        for(let i=0;i<res.data.length;i++){
          if(res.data[i].processName==="改变厅店状态"){
            changeList.push(res.data[i])
          }
        }
        this.list=changeList
      },
      //同意
      async agree(task){
        let { data: res } = await this.$http.put("/admin/corporation/trackall/"+task.taskId+"/agree")
        this.getInfoList()
      },
      //拒绝
      async reject(task){
        let { data: res } = await this.$http.put("/admin/corporation/trackall/"+task.taskId+"/reject")
        this.getInfoList()
      }
    }
  };
</script>

<style lang="less">
  .demo-table-expand {
    font-size: 0;
  }
  .demo-table-expand label {
    width: 120px;
    color: #99a9bf;
  }
  .demo-table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
    width: 80%;
  }
  .marginTop{
    margin-top: 10px;
  }
</style>
